<template>
	<main-container v-loading="loading">
		<el-card>
			<template #header>
				<div>
					<span>商城配置</span>
				</div>
			</template>
			<el-form ref="formRef" :model="form" :rules="rules" label-width="300px">
				<el-form-item label="商城回调地址(支付回调、物流回调) " prop="notifyDomain">
					<el-input v-model="form.notifyDomain"></el-input>
				</el-form-item>
				<el-form-item label="商城订单超时自动取消时间（分钟）" prop="orderTimeOut">
					<el-input-number v-model="form.orderTimeOut" :min="1" :precision="0" controls-position="right" />
				</el-form-item>
				<el-form-item label="商城订单自动收货时间（天）" prop="defaultReceiverTime">
					<el-input-number v-model="form.defaultReceiverTime" :min="1" :precision="0" controls-position="right" />
				</el-form-item>
				<el-form-item label="商城订单默认评价时间（天）" prop="defaultAppraiseTime">
					<el-input-number v-model="form.defaultAppraiseTime" :min="1" :precision="0" controls-position="right" />
				</el-form-item>
				<el-form-item label="快递100授权key" prop="logisticsKey">
					<el-input v-model="form.logisticsKey"></el-input>
				</el-form-item>
				<span class="hx-card-footer">
					<el-button type="primary" @click="submitForm(formRef)" :loading="loading">保 存</el-button>
				</span>
			</el-form>
		</el-card>
	</main-container>
</template>
<script lang="ts">
import { defineComponent, reactive, toRefs, ref } from 'vue';
import { getConfig, editObj } from '/@/api/mall/mallconfig';
import { ElMessage, FormInstance, FormRules } from 'element-plus';
export default defineComponent({
	setup() {
		const data = reactive({
			form: {
				notifyDomain: '',
				orderTimeOut: 0,
				defaultReceiverTime: 0,
				defaultAppraiseTime: 0,
				logisticsKey: '',
			},
			rules: {
				notifyDomain: [
					{
						required: true,
						message: '请输入商城回调地址',
						trigger: 'change',
					},
				],
				orderTimeOut: [
					{
						required: true,
						message: '请输入商城订单超时自动取消时间',
						trigger: 'change',
					},
				],
				defaultReceiverTime: [
					{
						required: true,
						message: '请输入商城订单自动收货时间',
						trigger: 'change',
					},
				],
				defaultAppraiseTime: [
					{
						required: true,
						message: '请输入商城订单默认评价时间',
						trigger: 'change',
					},
				],

				logisticsKey: [
					{
						required: true,
						message: '请输入快递100授权key',
						trigger: 'change',
					},
				],
			},
			loading: false,
		});
		const formRef = ref();
		const initConfig = async () => {
			data.loading = true;
			await getConfig()
				.then((response) => {
					data.form = response.data.data;
					data.loading = false;
				})
				.catch(() => {
					data.loading = false;
				});
		};
		/**
 * 修改配置
 */
		const submitForm = async (formEl: FormInstance | undefined) => {
			if (!formEl) return;
			await formEl.validate((valid, fields) => {
				if (valid) {
					data.loading = true;
					editObj(data.form)
						.then((response) => {
							data.loading = false
							ElMessage.success('修改成功');
						})
						.catch(() => {
							data.loading = false
						})
				}
			});
		};

		initConfig();
		return {
			formRef,
			submitForm,
			...toRefs(data),
		};
	},
});
</script>
<style lang="scss" scoped></style>
